<template lang="html">
    <div class="">
        <h3>多选</h3>
        <input type="checkbox" value="apple" v-model="myValue" />
        <label>苹果</label>
        <input type="checkbox" value="banana" v-model="myValue" />
        <label>香蕉</label>
        <input type="checkbox" value="peer" v-model="myValue" />
        <label>鸭梨</label>
        <input type="checkbox" value="pink" v-model="myValue" />
        <label>桃</label>
        <br>
        多选值 ： {{myValue}}
        <hr>

        <h3>单选</h3>
        <input type="radio" value="movie" v-model="radio" />
        <label>电影</label>
        <input type="radio" value="playing" v-model="radio" />
        <label>游戏</label>
        <input type="radio" value="basketball" v-model="radio" />
        <label>篮球</label>
        <input type="radio" value="swiming" v-model="radio" />
        <label>游泳</label>
        <br>
        单选值： {{radio}}

        <hr>
        <h3>下拉列表</h3>
        <select class="" name="" v-model="select">
            <option value="0">苹果</option>
            <option value="1">香蕉</option>
            <option value="2">桃子</option>
        </select>
        <br>
        下拉列表值: {{select}}
        <hr>
        <h3>组角实现的下拉列表</h3>
        <v-select :options="options"></v-select>
    </div>

</template>

<script>
import vSelect from '@/base/component/select';
export default {
	components: {
		vSelect
	},
	data() {
		return {
			myValue: [],
			radio: '',
			select: 1,
			options: [{
					value: 0,
					name: '篮球球'
				},
				{
					value: 1,
					name: '足球'
				},
				{
					value: 2,
					name: '台球球'
				}
			]
		}
	}
}
</script>

<style lang="css">
</style>
